<!--
 * @Author: TANGB02 13233582+Ace-Tang@user.noreply.gitee.com
 * @Date: 2024-03-03 22:01:08
 * @LastEditors: TANGB02 13233582+Ace-Tang@user.noreply.gitee.com
 * @LastEditTime: 2024-03-13 09:46:11
 * @FilePath: \ycq\ycq1.0\src\pages\applicationRecords\applicationRecords.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <!-- 面包屑 -->
  <a-breadcrumb style="margin: 16px" separator=">">
    <a-breadcrumb-item
      v-for="(item, index) in $route.matched"
      :key="index"
      :to="{ path: item.path }"
      style="cursor: pointer"
    >
      {{ item.meta.title }}
    </a-breadcrumb-item>
  </a-breadcrumb>

  <div class="table">
    <a-table
      :dataSource="dataSource"
      :columns="columns"
      @change="handleTableChange"
      :pagination="pagination"
    >
      <template #bodyCell="obj">
        <div v-if="obj.column.dataIndex === 'applicationStatus'">
          {{ getAppStatus(obj.record.applicationStatus) }}
        </div>
      </template>
    </a-table>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { message } from "ant-design-vue";
import { getApplicationRecords } from "@/service/api.js";
import LocalCatch from "@/utils/token.js";
const dataSource = ref([]);
const pagination = ref({
  current: 1,
  total: 0,
  pageSize: 10,
  showTotal: (total) => {
    return `共${total}条`;
  },
});
const columns = ref([
  {
    title: "领养人姓名",
    dataIndex: "applicationName",
    align: "center",
  },
  {
    title: "联系电话",
    dataIndex: "phone",
    align: "center",
  },
  {
    title: "动物编号",
    dataIndex: "animalNumbers",
    align: "center",
  },

  {
    title: "申请时间",
    dataIndex: "applicationTime",
    align: "center",
  },
  {
    title: "申请状态",
    dataIndex: "applicationStatus",
    align: "center",
  },
]);
const getAppRecords = async () => {
  const userId = parseInt(LocalCatch.getToken("userId"));
  const res = await getApplicationRecords({ userId });
  console.log(res);

  if (res.code === 1) {
    dataSource.value = res.data.records;
    pagination.current = res.data.current;
    pagination.total = res.data.total;
  }
};
getAppRecords();
const getAppStatus = (AppStatus) => {
  switch (AppStatus) {
    case 0:
      return "审核中";
    case 1:
      return "已通过";
    case 2:
      return "已拒绝";
    case 3:
      return "已取消";
    default:
      return "未知状态";
  }
};
</script>
<style scoped>
.table {
  margin-top: 50px;
}
</style>
